<template>
    <div id="dialog">
        <el-dialog
            :title="DialogData.title"
            :visible.sync="DialogData.show"
            width="60%"
            >
                <div class="form">

                    <el-form :model="FormData" status-icon  ref="ruleForm" label-width="100px" class="demo-ruleForm">

                    <el-form-item label="课程" prop="pass">
                        <el-select v-model="FormData.classid" placeholder="请选择">
                                    <el-option
                                    v-for="item in options"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value">
                                    </el-option>
                                </el-select>
                    </el-form-item>
                    
                  
                    </el-form>

                </div>
            <span slot="footer" class="dialog-footer">
                <el-button @click="DialogData.show = false">取 消</el-button>
                <el-button type="primary" @click="SubForm">确 定</el-button>
            </span>
            </el-dialog>
    </div>
</template>

<script>
    export default {
        props: {
            DialogData: Object,
            FormData: Object,
        },
        data() {
            return {
                MenuList: [],
                options: [],
                status: [
                    { value: 1, label: "开启"},
                    { value: 2, label: "关闭"},
                ],
                limit: 1,
                dialogImageUrl: '',
                dialogVisible: false,
                disabled: false,
                icon: "",
            }
        },
        computed: {
            token() {
                return localStorage.token;
            },
          
        },
        mounted() {
            this.getClass()
        },
        methods: {

            // 获取所有课程
            async getClass() {
                let arr = []
                let res = await this.$axios.post("/admin/website/classnameshow", { token: this.token })
                // console.log(res);
                
                if (res.data.data) {
                    arr = res.data.data
                    arr.forEach(el => {
                        this.options.push({
                            value: el.id,
                            label: el.classname
                        })
                    });
                    this.options.unshift({
                        value: 0,
                        label: "不分配"
                    })
                }
            },
          
            // 提交添加或修改
            async  SubForm() {
                this.FormData.token = this.token
                console.log(this.FormData);
                
                let res = await this.$axios.post("/admin/user/kaiclass", this.FormData)
                 console.log(res);
                if(res.data.code == 204 || res.data.code == 202) {
                    this.$message.success("更新成功")
                    this.$emit("update")
                    this.DialogData.show = false
                } else {
                    this.$message.success("更新失败")
                    this.$emit("update")
                    this.DialogData.show = false
                }
            },
 
        }
    }
</script>

<style lang="scss" scoped>
.sltbox {
    width: 148px;
    height: 148px;
    margin: 0 10px;
    img {
        width: 148px;
        height: 148px;
    }
}
.up {
    width: 100%;
    display: flex;
}
</style>